@media screen and (max-width:768px){
    .navigation{
        .nav{
            div:nth-child(1){
                img{
                    margin-left: 30px;
                }
            }
        }
        .minNav{
            display: flex;
        }

        .maxNav{
            position: absolute;
            display: none !important;
            height: 250px !important;
            top: 60px;
            width: 100%;
            flex-direction: column !important;
            background-color: rgba(0, 0, 0, .85);
            &:hover{
                a{
                    color: white !important;
                    text-shadow: none !important;
                }
            }
        }
        
        .user{
            position: absolute;
            display: none !important;
            top: 60px;
            width: 100%;
            height: 50px;
            background-color: rgba(0, 0, 0, .85);
        }

        #ck1:checked{
            &~.nav{
                .user{
                    display: flex !important;
                }
            }
        }

        #ck2:checked{
            &~.nav{
                .maxNav{
                    display: flex !important;
                }
            }
        }
    }

    .content1{
        img{
            width: 100%;
            height: 750px !important;
            content: url('../img/minimg/1.jpeg');
        }
    }

    .content2{
        img{
            width: 100%;
            height: 750px !important;
            content: url('../img/minimg/3.jpeg');
        }
    }

    .content3{
        flex-direction: column;
        img{
            width: 100% !important;
            height: 700px !important;
        }
        img:nth-of-type(1){
            margin-bottom: 20px;
            content: url('../img/minimg/4.jpeg');
        }
        img:nth-child(2){
            content: url('../img/minimg/5.jpeg');
        }
    }
    .content4{
        .swiper{
            .swiper-button-prev{
                display: none;
            }
            .swiper-button-next{
                display: none;
            }
            .swiper-wrapper{
                .swiper-slide:nth-child(2n+1){
                    img{
                        content: url('../img/minimg/2-1.jpeg');
                    }
                }

                .swiper-slide:nth-child(2n){
                    img{
                        content: url('../img/minimg/2-2.jpeg');
                    }
                }
            }
        }
        
        img{
            width: 100%;
            height: 750px !important;
        }
    }

    .top{
        width: 60px !important;
        height: 70px !important;
        font-size: 25px;
        div{
            font-size: 12px;
        }
    }
}

@media screen and (max-width: 360px){
    .content1{
        img{
            width: 100%;
            height: 480px !important;
            content: url('../img/minimg/1.jpeg');
        }
    }

    .content2{
        img{
            width: 100%;
            height: 480px !important;
            content: url('../img/minimg/3.jpeg');
        }
    }

    .content3{
        flex-direction: column;
        img{
            width: 100% !important;
            height: 480px !important;
        }
        img:nth-of-type(1){
            margin-bottom: 20px;
            content: url('../img/minimg/4.jpeg');
        }
        img:nth-child(2){
            content: url('../img/minimg/5.jpeg');
        }
    }
    .content4{
        .swiper{
            .swiper-button-prev{
                display: none;
            }
            .swiper-button-next{
                display: none;
            }
            .swiper-wrapper{
                .swiper-slide:nth-child(2n+1){
                    img{
                        content: url('../img/minimg/2-1.jpeg');
                    }
                }

                .swiper-slide:nth-child(2n){
                    img{
                        content: url('../img/minimg/2-2.jpeg');
                    }
                }
            }
        }
        
        img{
            width: 100%;
            height: 480px !important;
        }
    }

    .top{
        width: 60px !important;
        height: 70px !important;
        font-size: 25px;
        div{
            font-size: 12px;
        }
    }
}


@media screen and (max-width: 720px) {
    .navigation{
        min-width: 420px !important;
    }
    .content{
        min-width: 420px !important;
    }
}